import 'package:baselib/util/common_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/controller/OrderControl.dart';
import 'package:flutter_app/util/colours.dart';
import 'package:super_tooltip/super_tooltip.dart';

class CarTypeItemPage extends StatefulWidget {

  int index;
  CarTypeItemPage(this.index);
  @override
  State<StatefulWidget> createState() {
    return new CarTypeItemPageState(index);
  }
}



class CarTypeItemPageState extends State<CarTypeItemPage>{

  int index;
  CarTypeItemPageState(this.index);
  OrderController control = OrderController.to;
  SuperTooltip tooltip;
  List<SuperTooltip> list=[];

  @override
  Widget build(BuildContext context) {
    // TODO: implement build

    return Opacity(opacity: control.baseInfo.value.carType[index].isSelect?1:0.6,
      child: Container(
        height: 100,
        child:MouseRegion(
          onEnter: (event){
            showContactTip(context);
            print("进入");
          },
          onExit: (event){
            print("退出");
            for(int i=0;i<list.length;i++){
              if(list[i].isOpen) {list[i].close();}
            }
          },
          onHover: (event){
            // showContactTip(context);
            print("移动");
          },
          child: Column(
            children: [
              Image.network(control.baseInfo.value.carType[index]?.image,height: 80,),
              Text(control.baseInfo.value.carType[index]?.name,style: TextStyle(color: Colors.black),),
              Visibility(
                  visible: control.baseInfo.value.carType[index].isSelect,
                  child: Container(
                    width: 100,
                    height: 3,
                    color: Colors.blueAccent,
                  ))
            ],
          ),)
        ,
      ),);
  }

  void showContactTip(BuildContext context){
    // We create the tooltip on the first use

    var renderBox = context.findRenderObject() as RenderBox;
    final overlay = Overlay.of(context).context.findRenderObject() as RenderBox;

    var targetGlobalCenter = renderBox
        .localToGlobal(renderBox.size.center(Offset.zero), ancestor: overlay);


    SuperTooltip tooltip = SuperTooltip(
       hasShadow: false,
       maxHeight: 110,
       backgroundColor: Colors.black,
       containsBackgroundOverlay:false,
      popupDirection: TooltipDirection.up,
      touchThrougArea: new Rect.fromLTWH(targetGlobalCenter.dx,
          targetGlobalCenter.dy-200, 200.0, 80.0),
      content: new Container(
          child: Column(
            children: [
              Text(
                "长宽高:${control.baseInfo.value.carType[index].length}*${control.baseInfo.value.carType[index].width}*${control.baseInfo.value.carType[index].height}",
                style: TextStyle(color: Colors.white),
                softWrap: true,
              ),
              Text(
                "载货体积:${control.baseInfo.value.carType[index].volume}方",
                style: TextStyle(color: Colors.white),
                softWrap: true,
              )
            ],
          )
      ),
    );

    tooltip.show(context);
    list.add(tooltip);
  }
}